/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
  useTheme,
  CCell,
  Table,
  TableBody,
  TableRow,
  Text,
  RCell, Cell,
} from "customize-easy-ui-component";
import { DirectLink, } from "../../../routing/Link";
import {检验编制核准} from "../rarelyVary";
import {multilines2Html} from "../../tools";

/**首页
 * @param original 是否为了打印正式版原始记录
 * */
export const 首页设备概况fk= ({theme, orc, original } :{theme: any, orc:any, original?:boolean}
) => {
  return  <Table fixed={ ["20%","%"] }  css={ {borderCollapse: 'collapse'} }>
    <TableBody rheight={40}>
      <TableRow>
        <RCell css={{border:'none'}}>使用单位：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.使用单位}</CCell>
      </TableRow>
      {original && <TableRow >
          <RCell css={{border:'none'}}>分支机构：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.分支机构 || '／'}</CCell>
        </TableRow>
      }
      <TableRow >
        <RCell css={{border:'none'}}>设 备 类 别：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.eqpcod}</CCell>
      </TableRow>
      <TableRow >
        <RCell css={{border:'none'}}>设 备 品 种：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>定期检验</CCell>
      </TableRow>
      {!original && <><TableRow>
          <RCell css={{border:'none'}}>产品名称：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.设备名称 || '／'}</CCell>
        </TableRow>
        <TableRow>
          <RCell css={{border:'none'}}>产品型号：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.型号}</CCell>
        </TableRow></>
      }
      {original && <TableRow>
          <RCell css={{border:'none'}}>记 录 编 号：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.监察识别码}</CCell>
        </TableRow>
      }
      <TableRow>
        <RCell css={{border:'none'}}>设 备 代 码：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>定期检验</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>监察识别码：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.监察识别码}</CCell>
      </TableRow>
      {!original && <>
        <TableRow>
          <RCell css={{border:'none'}}>车牌编号：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.上路号牌}</CCell>
        </TableRow>
        <TableRow>
          <RCell css={{border:'none'}}>使用登记证编号：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.使用证号}</CCell>
        </TableRow>
        <TableRow>
          <RCell css={{border:'none'}}>检验类别：</RCell>
          <CCell css={{border:'none',borderBottom:`1px dashed`}}>定期检验</CCell>
        </TableRow>
       </>
      }
      <TableRow>
        <RCell css={{border:'none'}}>设  备  号：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.eqpcod}</CCell>
      </TableRow>
      <TableRow>
        <RCell css={{border:'none'}}>检 验 日 期：</RCell>
        <CCell css={{border:'none',borderBottom:`1px dashed`}}>{orc.检验日期}</CCell>
      </TableRow>
    </TableBody>
  </Table>;
};

/**正式报告用的
 * */
export const 报告设备详情= ( { orc,  repId, verId, rep } : { orc: any,repId: string,verId: string,rep:any}
) => {
  const theme= useTheme();
  return <React.Fragment>
    <DirectLink  href={`/report/FORK-DJ/ver/${verId}/${repId}/Survey#Survey`}>
      <Table id={'Survey'} fixed={ ["15%","34%","4%","12%","%"] }  css={ {borderCollapse: 'collapse' } }>
        <TableBody>
          <TableRow>
            <CCell>使用单位名称</CCell><CCell colSpan={4}>{orc?.使用单位}</CCell>
          </TableRow>
          <TableRow>
            <CCell>使用单位地址</CCell><CCell colSpan={4}>{orc?.使用单位地址}</CCell>
          </TableRow>
          <TableRow>
            <CCell>分支机构</CCell><CCell colSpan={4}>{orc?.分支机构}</CCell>
          </TableRow>
          <TableRow>
            <CCell>联系人</CCell><CCell>{orc?.使单联人}</CCell>
            <CCell colSpan={2}>联系电话</CCell><CCell>{orc?.联系电话}</CCell>
          </TableRow>
          <TableRow>
            <CCell>统一社会信用代码</CCell><CCell>{orc?.使用单位信用码}</CCell>
            <CCell colSpan={2}>使用登记证编号</CCell><CCell>{orc?.使用证号}</CCell>
          </TableRow>
          <TableRow>
            <CCell>制造单位名称</CCell><CCell colSpan={4}>{orc?.制造单位}</CCell>
          </TableRow>
          <TableRow>
            <CCell>改造单位名称</CCell><CCell colSpan={4}>{orc?.改造单位}</CCell>
          </TableRow>
          <TableRow>
            <CCell>修理单位名称</CCell><CCell colSpan={4}>{orc?.维修单位}</CCell>
          </TableRow>
          <TableRow>
            <CCell>产品名称</CCell><CCell>{orc?.设备名称}</CCell>
            <CCell colSpan={2}>设备代码</CCell><CCell>{orc?.eqpcod}</CCell>
          </TableRow>
          <TableRow>
            <CCell>产品型号</CCell><CCell>{orc?.型号}</CCell>
            <CCell colSpan={2}>产品编号</CCell><CCell>{orc?.出厂编号}</CCell>
          </TableRow>
          <TableRow>
            <CCell>车架编号</CCell><CCell>{orc?.底盘编号}</CCell>
            <CCell colSpan={2}>发动机(行走电机)编号</CCell><CCell>{orc?.发动机号}</CCell>
          </TableRow>
          <TableRow>
            <CCell>额定起重量</CCell>
            <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
              <Text >{orc?.额定载荷}</Text>
              <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>kg</Text>
            </div></CCell>
            <CCell rowSpan={3}>防爆</CCell>
            <CCell>设备保护级别</CCell><CCell>{orc?.防爆等级}</CCell>
          </TableRow>
          <TableRow>
            <CCell>动力方式</CCell><CCell>{orc?.动力方式}</CCell>
            <CCell>气体/粉尘组别</CCell><CCell>{orc?.粉尘组}</CCell>
          </TableRow>
          <TableRow>
            <CCell>传动方式</CCell><CCell>{orc?.传动方式}</CCell>
            <CCell>温度组别</CCell><CCell>{orc?.温度组}</CCell>
          </TableRow>
          <TableRow>
            <CCell>车架结构</CCell><CCell>{orc?.车架结构}</CCell>
            <CCell colSpan={2}>驾驶方式</CCell><CCell>{orc?.驾驶式}</CCell>
          </TableRow>
          <TableRow>
            <CCell>自重</CCell>
            <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
              <Text >{orc?.自重量}</Text>
              <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>kg</Text>
            </div></CCell>
            <CCell colSpan={2}>空载最大运行速度</CCell>
              <CCell><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
              <Text >{orc?.运行速度}</Text>
              <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>km/h</Text>
            </div></CCell>
          </TableRow>
          <TableRow>
            <CCell>空载最大起升高度</CCell>
            <CCell colSpan={4}><div css={{ display: 'flex',justifyContent: 'space-around',alignItems: 'center'}}>
              <Text >{orc?.最大升高}</Text>
              <Text css={{ [theme.mediaQueries.lg+', print']: {wordBreak: 'keep-all'} }}>mm</Text>
            </div></CCell>
          </TableRow>
          <TableRow>
            <CCell>检验依据</CCell><CCell colSpan={4}>《场（厂）内专用机动车辆安全技术规程》(TSG 81－2022)</CCell>
          </TableRow>
          <TableRow>
            <CCell>检验结论</CCell><CCell colSpan={4}><Text variant="h1" css={{fontSize:'4rem'}}>{orc?.检验结论}</Text></CCell>
          </TableRow>
          <TableRow>
            <CCell>备注</CCell>
            <Cell colSpan={4}>{multilines2Html(orc?.大备注,  (txt,i)=>{
              return <React.Fragment key={i}>{(i!==0)&&<br/>}<Text>{txt}</Text></React.Fragment>
            })}</Cell>
          </TableRow>
        </TableBody>
      </Table>
    </DirectLink>
    {检验编制核准({orc,rep})}
  </React.Fragment>;
};
